// -------------------------- GENERIC --------------------------
@import "openproject/variables"
@import "openproject/mixins"
@import "fonts/openproject_icon_definitions"
@import "fonts/openproject_icon_font"

@import "tabs"
@import "toolbar"
@import "loading_modal"
@import "context_menu"
@import "tooltips"
@import "pivot_point"

// The IFC viewer shall fill the viewport to the bottom.
// This is different to how we style #content else where.
.controller-bim\/ifc_models\/ifc_viewer
  overflow: hidden

  &.action-show
    #content
      height: 100%

  // Override default behavior to let the viewer span the whole height
  @media only screen and (max-width: 679px)
    @include extended-content--right
    @include extended-content--left
    #content-wrapper
      height: calc(100vh - 55px)

    .work-packages-partitioned-page--content-container
      flex-direction: column

    .ifc-model-viewer--container
      height: 33vh !important

[data-name="bim"] .main-menu--children
  overflow-x: hidden !important

// -------------------------- XEOKIT specific rules for BUTTONS --------------------------
.xeokit-btn-group
  vertical-align: middle

  &:not(:last-of-type)
    margin-right: .5rem

.xeokit-btn
  position: relative
  background-color: $button--background-color
  vertical-align: middle
  padding: .375rem .75rem
  border-radius: 2px
  border: 1px solid $button--border-color
  @include default-transition

  &:hover
    @include varprop(background-color, button--background-hover-color)


  &.disabled
    opacity: .55

  &.active
    @include varprop(color, button--active-font-color)
    @include varprop(background-color, button--active-background-color)
    @include varprop(border-color, button--active-border-color)
    box-shadow: 0 0 3px $button--active-border-color inset
